<template>
  <div>
    <div class="detail" v-for="(item,index) in details" :key="index">
      <p class="title"><span v-if="item.isNew">[新的订单]</span>{{item.title}}</p>
      <p class="content">{{item.content}}</p>
      <p class="time">{{item.time}}</p>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      details:[
        {
          isNew:true,
          title:'支付成功',
          content:'亲爱的用户：您的订单（17265178364006）已支付成功。',
          time:'2018-04-30  11:05:36'
        },
        {
          isNew:false,
          title:'已安装',
          content:'亲爱的用户：您的订单（17265178364006）已在金顺汽修厂安装成功，评价商家的服务，还有积分奖励哦。',
          time:'2018-04-30  11:05:36'
        },
        {
          isNew:false,
          title:'已评价',
          content:'亲爱的用户，非常感谢您的评价，5积分已奉上，指定可享受直抵现金优惠。',
          time:'2018-04-30  11:05:36'
        },
      ],     
    }
  }
}
</script>

<style lang="less" scoped>
  .detail {
    padding:30rpx 30rpx 15rpx 30rpx;
    &:not(:last-child) {
      border-bottom:1px solid #E6E6E6
    }
    .title {
      font-size:34rpx;
      &>span{
        color:#EC681F;
      }
    }
    .content {
      font-size:30rpx;
      color:#A9A9A9;
      text-align:justify;
    }
    .time {
      font-size:30rpx;
      color:#D6D6D6;
    }
  }
</style>

